/**
 * Created by xxx on 2017年12月11日.
 */
//父组件
var Main = React.createClass({
    //组件初始状态
    getInitialState: function () {
        return {
            tableData:[],//右侧信息
            addressData: [],//左侧地址数据
            addressUuid: '',
        }
    },
    componentDidMount: function () {
        this.getAddressListTwo(1,'china');//获取所有地址
    },
    /**
     * 获取所有地址--商户地区地址
     * @param num 查询的是1：省 :2：市:3：区
     * @param uuid 要查询的其子机构的当前机构id,不传会返回国家，传”china”会返回所有省
     */
    getAddressListTwo: function (num,uuid,index=[0,0,0],key='') {
        suixun.showLoding();//显示加载中
        suixun.ajax(serverUrl+'/region/getRegions.json?uuid='+uuid,'',"get",function(data){
            suixun.hideLoding(2000);//显示加载中
            if(data.code == 200){
                if(num == "1"){
                    var provinceData = [];
                    for(var i = 0 ;i < data.info.length;i++ ){
                        provinceData[i] = {uuid:data.info[i].uuid,value:data.info[i].orgName,select:false,children:[],showChild:false,halfSelected:false};
                    }
                    this.setState({addressData:provinceData});
                    for(var k = 0;k<provinceData.length;k++){
                        this.getAddressListTwo(2,provinceData[k].uuid,[k,0,0]);
                    }
                }else if(num == "2"){
                    var cityData = [],addressData = this.state.addressData;
                    for(var i = 0 ;i < data.info.length;i++ ){
                        cityData[i] = {uuid:data.info[i].uuid,value:data.info[i].orgName,select:addressData[index[0]].select,children:[],showChild:false,halfSelected:false};
                    }
                    addressData[index[0]].children = cityData;
                    addressData[index[0]][key] = !addressData[index[0]][key];
                    this.setState({addressData:addressData});
                    for(var k = 0;k<addressData.length;k++){
                        for(var j = 0;j<addressData[k].children.length;j++){
                            this.getAddressListTwo(3,addressData[k].children[j].uuid,[k,j,0]);
                        }
                    }
                }else{
                    var countyData = [],addressData = this.state.addressData;
                    for(var i = 0 ;i < data.info.length;i++ ){
                        countyData[i] = {uuid:data.info[i].uuid,value:data.info[i].orgName,select:addressData[index[0]]['children'][index[1]].select};
                    }
                    addressData[index[0]]['children'][index[1]].children = countyData;
                    addressData[index[0]]['children'][index[1]][key] = !(addressData[index[0]]['children'][index[1]][key]);
                    this.setState({addressData:addressData});
                }
            }
        }.bind(this));
    },
    /**
     * 获取所有地址
     * @param num 查询的是1：省 :2：市:3：区
     * @param province 省
     * @param city 市
     */
    getAddressList: function (num,province='',city='',index=[0,0,0],key='') {
        var param="param={";
        param = getJsonDataNotEmpty(param,"type",'"'+num+'"');
        param = getJsonDataNotEmpty(param,"province",'"'+province+'"');
        param = getJsonDataNotEmpty(param,"city",'"'+city+'"');
        param += "}";
        suixun.showLoding();//显示加载中
        suixun.ajax(serverUrl+'/schoolManage/queryRegion.json',param,"get",function(data){
            suixun.hideLoding();//显示加载中
            if(data.code == 200){
                if(num == "1"){
                    var provinceData = [];
                    for(var i = 0 ;i < data.info.length;i++ ){
                        provinceData[i] = {value:data.info[i].province,select:false,children:[],showChild:false,halfSelected:false};
                    }
                    this.setState({addressData:provinceData});
                }else if(num == "2"){
                    var cityData = [],addressData = this.state.addressData;
                    for(var i = 0 ;i < data.info.length;i++ ){
                        cityData[i] = {value:data.info[i].city,select:addressData[index[0]].select,children:[],showChild:false,halfSelected:false};
                    }
                    addressData[index[0]].children = cityData;
                    addressData[index[0]][key] = !addressData[index[0]][key];
                    this.setState({addressData:addressData});
                }else{
                    var countyData = [],addressData = this.state.addressData;
                    for(var i = 0 ;i < data.info.length;i++ ){
                        countyData[i] = {value:data.info[i].town,select:addressData[index[0]]['children'][index[1]].select};
                    }
                    addressData[index[0]]['children'][index[1]].children = countyData;
                    addressData[index[0]]['children'][index[1]][key] = !(addressData[index[0]]['children'][index[1]][key]);
                    this.setState({addressData:addressData});
                }
            }
        }.bind(this));
    },

    /**
     * 设置地区状态
     * @param type 1、省 2、市 3、区
     * @param [info] 数据
     * @param key 要修改键的值
     * @param [index]
     * @return {XML}
     */
    setAddress: function (type, info, key,index) {
        var addressData = this.state.addressData,isKey = key=='select'?true:false;
        if(isKey){
            // this.removeSelectAddress();
            //选择多个则不调用这个
            // this.getHideEntrances(info.uuid);
            this.setState({addressUuid:info.uuid});
        }
        if(type==1){
            if(addressData[index[0]].children.length==0&&key=='showChild'){//是否显示
                // this.getAddressListTwo(2,info.uuid,index,key);
            }else{
                var boo = !addressData[index[0]][key];
                addressData[index[0]][key] = boo;
                if(isKey){

                    for(var j = 0;j< addressData[index[0]].children.length;j++){
                        addressData[index[0]].children[j].select = boo;
                        for(var h = 0;h< addressData[index[0]].children[j].children.length;h++){
                            addressData[index[0]].children[j].children[h].select = boo;
                        }
                    }
                }
                this.setState({addressData:addressData});
                if(key=='select'){
                    setTimeout(function () {
                        this.setSelect();
                    }.bind(this),100);
                }
            }
        }else if(type==2){
            if( addressData[index[0]]['children'][index[1]].children.length==0&&key=='showChild'){//是否显示
                // this.getAddressListTwo(3,info.uuid,index,key);
                // this.getAddressListTwo(3,addressData[index[0]].uuid,index,key);
            }else{
                var boo = !(addressData[index[0]]['children'][index[1]][key]),citySelect = 0,province = addressData[index[0]];
                province['children'][index[1]][key] = boo;
                for(var p = 0;p<province['children'].length;p++){
                    if(province['children'][p].select){
                        citySelect++;
                    }
                }
                if(citySelect == province['children'].length){
                    province.select = true;
                    province.halfSelected = true;//父节点是否高亮
                }else if(citySelect>0){
                    province.select = false;
                    province.halfSelected = true;//父节点是否高亮
                }else if(citySelect==0){
                    province.select = false;
                    province.halfSelected = false;//父节点是否高亮
                }
                // addressData[index[0]].halfSelected = boo;//父节点是否高亮
                if(isKey){
                    for(var h = 0;h< addressData[index[0]]['children'][index[1]].children.length;h++){
                        addressData[index[0]]['children'][index[1]].children[h].select = boo;
                    }
                }
                this.setState({addressData:addressData});
                if(key=='select'){
                    setTimeout(function () {
                        this.setSelect();
                    }.bind(this),100);
                }
            }
        }else if(type==3){
            var citySelect = 0,province = addressData[index[0]],tonwSelect = 0,city = province['children'][index[1]];
            city['children'][index[2]][key] = !(city['children'][index[2]][key]);
            //判断区级
            for(var c = 0;c<city['children'].length;c++){
                if(city['children'][c].select){
                    tonwSelect++;
                }
            }
            if(tonwSelect == city['children'].length){
                city.select = true;
                city.halfSelected = true;//父节点是否高亮
            }else if(tonwSelect>0){
                city.select = false;
                city.halfSelected = true;//父节点是否高亮
            }else if(tonwSelect==0){
                city.select = false;
                city.halfSelected = false;//父节点是否高亮
            }
            //判断省级
            for(var p = 0;p<province['children'].length;p++){
                if(province['children'][p].select){
                    citySelect++;
                }
            }
            if(citySelect == province['children'].length){
                province.select = true;
                province.halfSelected = true;//父节点是否高亮
            }else if(citySelect>0){
                province.select = false;
                province.halfSelected = true;//父节点是否高亮
            }else if(citySelect==0){
                province.select = false;
                province.halfSelected = false;//父节点是否高亮
            }
            // addressData[index[0]].halfSelected = true;
            // addressData[index[0]]['children'][index[1]].halfSelected = true;
            this.setState({addressData:addressData});
            if(key=='select'){
                setTimeout(function () {
                    this.setSelect();
                }.bind(this),100);
            }
        }
    },
    /**
     * 设置是否待定
     */
    setSelect: function () {
        var uuidArray = this.getUuid();
        if(uuidArray.length==1){
            this.getHideEntrances(uuidArray[0]);
        }else{
            $("#guardianHide").val('other');
            $("#teacherHide").val('other');
        }
    },
    /**
     * 获取选中的uuid
     * @return uuidArray 选中uuids
     */
    getUuid:function () {
        var uuidArray = [];
        var addressData = this.state.addressData;
        for(var k = 0;k<addressData.length;k++){
            if(addressData[k].select){
                uuidArray.push(addressData[k].uuid);
            }
            for(var j = 0;j<addressData[k].children.length;j++){
                if(addressData[k].children[j].select){
                    uuidArray.push(addressData[k].children[j].uuid);
                }
                for(var h = 0;h<addressData[k].children[j].children.length;h++){
                    if(addressData[k].children[j].children[h].select){
                        uuidArray.push(addressData[k].children[j].children[h].uuid);
                    }
                }
            }
        }
        return uuidArray;
    },
    /**
     * 移除所有选中、半选中的地区
     * @return {XML}
     */
    removeSelectAddress: function () {
        var addressData = this.state.addressData;
        for(var k = 0;k<addressData.length;k++){
            addressData[k].select = false;
            addressData[k].halfSelected = false;
            for(var j = 0;j<addressData[k].children.length;j++){
                addressData[k].children[j].select = false;
                addressData[k].children[j].halfSelected = false;
                for(var h = 0;h<addressData[k].children[j].children.length;h++){
                    addressData[k].children[j].children[h].select = false;
                }
            }
        }
        this.setState({addressData:addressData});
    },
    /**
     * 获取积分配置——没有数据则显示，有数据则隐藏
     * @param uuid
     */
    getHideEntrances: function (uuid) {
        suixun.showLoding();//显示加载中
        suixun.ajax(serverUrl+'/credits/entrance/getHideEntrances.json?uuid='+uuid,'',"get",function(data){
            suixun.hideLoding();//隐藏加载中
            if(data.code == 200){
                if(data.info.length==0){
                    $("#guardianHide").val('true');
                    $("#teacherHide").val('true');
                }else if(data.info.length==1){
                    if(data.info[0].hideRange==1){
                        $("#guardianHide").val('true');
                        $("#teacherHide").val('false');
                    }else{
                        $("#guardianHide").val('false');
                        $("#teacherHide").val('true');
                    }
                }else if(data.info.length==2){
                    $("#guardianHide").val('false');
                    $("#teacherHide").val('false');
                }
            }else{
                suixun.alert(data.msg);
            }
        }.bind(this));
    },

    /**
     * 修改积分配置——没有数据则显示，有数据则隐藏
     * @return {XML}
     */
    hideEntrance: function () {
        var guardianHide = $("#guardianHide").val();
        var teacherHide = $("#teacherHide").val();
        if(guardianHide == 'other'){
            suixun.alert('请修改园丁园入口是否显示！');
            return;
        }else if(guardianHide=='false'){
            guardianHide = 'true';
        }else{
            guardianHide = 'false';
        }
        if(teacherHide == 'other'){
            suixun.alert('请修改快乐城堡入口是否显示！');
            return;
        }else if(teacherHide=='false'){
            teacherHide = 'true';
        }else{
            teacherHide = 'false';
        }
        var uuidArray = this.getUuid();
        if(uuidArray.length==0){
            suixun.alert('请选择地区！');
            return;
        }
        var count = uuidArray.length;
        suixun.showLoding();//显示加载中
        for(let k = 0;k<uuidArray.length;k++){
           this.changgeHideEntrance(uuidArray[k],guardianHide,teacherHide,function (b) {
               if(b){
                   count --;
               }
           });
        }
        var hideEntranceInt = setInterval(function () {
            if(count==0){
                suixun.hideLoding();//隐藏加载中
                suixun.alert('操作成功!');
                window.clearInterval(hideEntranceInt);
            }
        },500);
        // this.changgeHideEntrance(uuid,guardianHide,teacherHide);
    },
    /**
     * 修改积分配置——没有数据则显示，有数据则隐藏
     * @return b
     */
    changgeHideEntrance: function (uuid,guardianHide,teacherHide,callback) {
        suixun.ajax(serverUrl+'/credits/entrance/hideEntrance.json?uuid='+uuid+'&guardianHide='+guardianHide+'&teacherHide='+teacherHide,'',"get",function(data){
            if(data.code == 200){
                // suixun.alert('操作成功!',function (al_data) {
                //     if(al_data){
                //         // this.getHideEntrances(uuid);
                //     }
                // }.bind(this));
                callback(true);//回调
            }else{
                suixun.alert(uuid+data.msg);
                callback(false);//回调
            }
        }.bind(this));
    },
    render: function () {
        {
            /**
             * 组装数据
             * @type {Array}
             */
            var addressDatas = this.state.addressData.map(function (provinceData,provinceIndex) {
                return (
                    <div className="provinces">
                        <div className="province-content">
                            <span className={provinceData.showChild?"addressTriangle  isOpen":"addressTriangle "} onClick={this.setAddress.bind(this,1,provinceData,'showChild',[provinceIndex])}/>
                            <span className={provinceData.select?"addressRadio checkBox isSelect":"addressRadio checkBox"} onClick={this.setAddress.bind(this,1,provinceData,'select',[provinceIndex])}/>
                            <span className={provinceData.halfSelected?provinceData.showChild?"addressValue text-sub ":"addressValue text-sub halfSelected":"addressValue text-sub"} title={provinceData.value}  onClick={this.setAddress.bind(this,1,provinceData,'select',[provinceIndex])}>{provinceData.value}</span>
                        </div>
                        {
                            provinceData.showChild?
                                provinceData.children.map(function (cityData,cityIndex) {
                                    return (
                                        <div className="citys">
                                            <div className="city-content">
                                                <span className={cityData.showChild?"addressTriangle isOpen":"addressTriangle"} onClick={this.setAddress.bind(this,2,cityData,'showChild',[provinceIndex,cityIndex])}/>
                                                <span className={cityData.select?"addressRadio checkBox isSelect":"addressRadio checkBox"} onClick={this.setAddress.bind(this,2,cityData,'select',[provinceIndex,cityIndex])}/>
                                                <span className={cityData.halfSelected?cityData.showChild?"addressValue text-sub ":"addressValue text-sub halfSelected":"addressValue text-sub"} title={cityData.value}  onClick={this.setAddress.bind(this,2,cityData,'select',[provinceIndex,cityIndex])}>{cityData.value}</span>
                                            </div>
                                            {
                                                cityData.showChild?
                                                    cityData.children.map(function (countyData,countyIndex) {
                                                        return (
                                                            <div className="countys">
                                                                <div className="county-content ">
                                                                    <span className={countyData.select?"addressRadio checkBox isSelect":"addressRadio checkBox"} onClick={this.setAddress.bind(this,3,countyData,'select',[provinceIndex,cityIndex,countyIndex])}/>
                                                                    <span className="addressValue text-sub" title={countyData.value} onClick={this.setAddress.bind(this,3,countyData,'select',[provinceIndex,cityIndex,countyIndex])}>{countyData.value}</span>
                                                                </div>
                                                            </div>
                                                        )
                                                    }.bind(this)):''
                                            }
                                        </div>
                                    )
                                }.bind(this)):''

                        }
                    </div>
                )
            }.bind(this));
        }
        return (
            <div className="tableManage-body inteEntrConfig">
                <header>
                    <div className="header-left">
                        <div className="header-left-studentInfo">
                            <a href="javascript:void(0);" className="header-left-button menu-width  showOrder">积分入口配置</a>
                        </div>
                    </div>
                </header>
                <div id="content-left">
                    <div id="left-body" style={{height:'619px'}}>
                        <div className="addressAll" id="left-body-contents">
                            {addressDatas}
                        </div>
                    </div>
                </div>
                <div id="content-right">
                    <div className="body-updateAttendance">
                        <div className="body-title">老师端</div>
                        <div className="body-content" >
                            <div className="body-content-title">首页-园&nbsp;丁&nbsp;园&nbsp;入&nbsp;口：</div>
                            <div className="body-content-text">
                                <div className="content-select-border">
                                    <select className="export-factory msgType " selected={this.state.select} id="teacherHide">
                                        <option value="true" >是</option>
                                        <option value="false" >否</option>
                                        <option value="other" >待定</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        {/*<div className="body-content" >*/}
                            {/*<div className="body-content-title">我的-我的卡券入口：</div>*/}
                            {/*<div className="body-content-text">*/}
                                {/*<div className="content-select-border">*/}
                                    {/*<select className="export-factory msgType " id="teacherCardCoupons">*/}
                                        {/*<option value="true" >是</option>*/}
                                        {/*<option value="false" >否</option>*/}
                                    {/*</select>*/}
                                {/*</div>*/}
                            {/*</div>*/}
                        {/*</div>*/}
                        <div className="body-title">家长端</div>
                        <div className="body-content" >
                            <div className="body-content-title">首页-快乐城堡入口：</div>
                            <div className="body-content-text">
                                <div className="content-select-border">
                                    <select className="export-factory msgType " selected={this.state.select} id="guardianHide">
                                        <option value="true" >是</option>
                                        <option value="false" >否</option>
                                        <option value="other" >待定</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        {/*<div className="body-content" >*/}
                            {/*<div className="body-content-title">我的-我的卡券入口：</div>*/}
                            {/*<div className="body-content-text">*/}
                                {/*<div className="content-select-border">*/}
                                    {/*<select className="export-factory msgType " id="parentCardCoupons">*/}
                                        {/*<option value="true" >是</option>*/}
                                        {/*<option value="false" >否</option>*/}
                                    {/*</select>*/}
                                {/*</div>*/}
                            {/*</div>*/}
                        {/*</div>*/}
                        <div style={{color:'#FF585B'}}>注意：选择多个区域的保存操作时会有卡顿现象。</div>
                        <div className="body-content">
                            <span className="body-svae" onClick={this.hideEntrance.bind(this)}>保存</span>
                        </div>
                    </div>
                </div>
                <footer id="copyright">
                    <span><img src="../img/icon/copyright.png"/>{copyright}</span>
                </footer>
            </div>
        );
    }
});
ReactDOM.render(
    <Main />,
    document.getElementById('tableManage')
);

